<template>
	<view class="body">
		<xk-header title="专项检查"></xk-header>
		<view class="list" >
			<view class="list-item header" @click="orderMore = !orderMore">
				<view>计划编号:  XY2021050001</view>
				<image v-if="!orderMore" src="/static/up.png"></image>
				<image v-else  src="/static/down.png"></image>
			</view>
			<view v-if="orderMore" class="data-item">
				<view class="order-info">
					<view class="info-item"><view class="key">计划名称：</view>台风预警核查</view>
					<view class="info-item"><view class="key">检查内容：</view>环境安全</view>
					<view class="info-item"><view class="key">检查日期：</view>2021-05-19</view>
					<view class="info-item"><view class="key">检查负责人：</view>黄琳</view>
				</view>
			</view>
		</view>
		<view class="list" >
			<view class="list-item header" @click="orderMore = !orderMore">
				<view>检查记录</view>
				<image v-if="!orderMore" src="/static/up.png"></image>
				<image v-else  src="/static/down.png"></image>
			</view>
			<view v-if="orderMore" class="data-item">
				<view class="order-info">
					<view class="info-item"><view class="key">检查人：</view>黄琳</view>
					<view @click="viewDetail" class="info-item" style="justify-content: space-between;">
						<view class="key">记录明细：</view>
						<view style="display: flex; align-items: center;">
							<text class="right-title1" style="color: #2C72FF;">查看明细</text>
							<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
						</view>
					</view>
					<view class="info-item"><view class="key">检查记录：</view>多出物业存在室内渗水情况</view>
					<view class="info-item"><view class="key">检查日期：</view>2021-05-23</view>
					<view class="info-item"><view class="key">备注：</view></view>
					<view class="info-item"><view class="key"></view>
						<image-list :pics="'/static/temp/temp.jpeg'"></image-list>
					</view>
				</view>
			</view>
		</view>

		<view class="list" >
			<view class="list-item header" @click="orderMore = !orderMore">
				<view>整改记录</view>
				<image v-if="!orderMore" src="/static/up.png"></image>
				<image v-else  src="/static/down.png"></image>
			</view>
			<view v-if="orderMore" class="data-item">
				<view class="order-info">
					<view class="info-item"><view class="key">整改跟进人：</view>黄琳</view>
					<view class="info-item"><view class="key">整改方案：</view>修补漏水点</view>
					<view class="info-item"><view class="key">整改日期：</view>2021-05-23</view>
					<view class="info-item"><view class="key">备注：</view></view>
				</view>
			</view>
		</view>
		<!-- <swiper class="swiper" :style="{height: swiperHeight + 'px'}" :current="current"
		 :duration="duration" @change="swiperTab">
			<swiper-item v-for="(item, index) in optionNum" :key="index">
				<view class="swiper-item">
					<view class="list-item" style="padding-bottom: 0rpx;">
						<view class="title">
							<view>检查明细</view>
							<view class="right-title">
								共<view style="margin: 0 6rpx;color: #2C72FF;">{{optionNum}}</view>个巡查项
							</view>
						</view>
						<view class="sub-title">{{index + 1}}/{{optionNum}} 巡查项</view>
						<view class="content">
							<text>
								物业片区：1幢
								物业编号：XY01120001
								物业分类：办公楼
								重点检查内容：室内是否漏水
							</text>
						</view>
						<view>
							<view>是否异常：是</view>
							<view>异常描述：室内渗水严重，存在电路安全隐患</view>
							<view>整改建议：修复漏水点</view>
						</view>

						<view class="handle-btn">
							<view>上一项</view>
							<view>下一项</view>
						</view>
					</view>
				</view>
			</swiper-item>
		</swiper> -->

		<view class="from-item" style="margin-top: 20rpx;">
			<view class="title">抽查意见</view>
			<textarea type="text" placeholder="在此输入抽查意见" placeholder-class="placeholder"/>
		</view>

		<view class="from-item">
			<view class="title">备注</view>
			<textarea type="text" placeholder="在此输入备注" placeholder-class="placeholder"/>
		</view>
		<!-- <view v-if="current + 1 < optionNum" class="common-btn" @click="nextOption">下一项</view> -->
		<view class="common-bottom-view">
			<view class="common-btn btn-plant" @click="reportRepair">退回</view>
			<view class="common-btn" @click="doneRepair">通过</view>
		</view>
		<view class="common-zw"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderMore: true,
				optionNum: 2,
				swiperHeight: 624,
				touchable: true, //禁止手指滑动切换
				duration: 500, //滑动时长
				current: 0, //当前显示的下标
				uploadImgs: [
					"/static/temp/temp.jpeg",
					"/static/temp/temp.jpeg",
				],
			};
		},
		onShow(){
			this.setSwiperHeight()
		},
		methods:{
			viewDetail(){
				uni.navigateTo({
					url: '/pagesA/special-check/special-check-result-detail'
				})
			},
			nextOption(){
				if(this.current + 1 < this.optionNum){
					this.current += 1;
				}
			},
			swiperTab(e) {
				this.current = parseInt(e.target.current);
				this.setSwiperHeight()
			},
			setSwiperHeight() {
				console.log('222222h')
				this.$util.getElRect('.swiper-item').then(res=>{
					console.log(res)
					this.swiperHeight = res.height;
				})

			},
			finishPatrol(){
				uni.navigateTo({
					url: '/pagesA/facility-patrol/facility-patrol-finish'
				})
			},
			reportRepair(){
				uni.navigateTo({
					url: '/pagesC/report-repair/report-repair-form'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
@import '@/common/from.scss';
</style>
